<template>
  <input class="input" v-model="value" :type="props.type" />
  <p v-if="errorMessage?.key" class="text-error">{{ $t(errorMessage.key, { ...errorMessage.values }) }}</p>
  <!-- <p class="text-error">{{ errorMessage }}</p> -->
</template>
<script setup>
import { useField } from 'vee-validate'

const props = defineProps({
  name: {
    type: String,
    default: '',
  },
  type: {
    type: String,
    default: 'text',
  },
})
const { value, errorMessage } = useField(() => props.name)
</script>
<style lang="scss" scoped>
.input {
  color: black;
  background-color: seashell;
}
</style>
